<template>
  <rx-layout>
    <div slot="center" style>
      <rx-fit>
        <div slot="toolheader" foldheader="true" foldbtn="false" border="false">
          <div class="table-operator">
              <a-button @click="addProcess">{{i18n('list.newProcess','新增流程')}}</a-button>
              <a-button @click="back">{{i18n('list.return','返回')}}</a-button>
          </div>
          <span class="search-btn-box">
                <span class="search-btn" @click="searchshow"><i class="iconfont iconguolv"></i>{{$ti18('rxList.leachBtn','过滤')}}</span>
           </span>
        </div>
        <div slot="searchbar" btnalign="right"  v-if="fitSearch" @search="search" @cancel="cancel" @close="close">
          <a-form layout="vertical">
                <a-form-item :label="i18n('form.processNum','流程编号')">
                    <a-input :placeholder="i18n('form.processNum','流程编号','input')" v-model="queryParam.Q_PROCESS_KEY__S_LK"/>
                </a-form-item>
                <a-form-item :label="i18n('form.processName','流程名称')">
                    <a-input :placeholder="i18n('form.processName','流程名称','input')" v-model="queryParam.Q_PROCESS_NAME__S_LK"/>
                </a-form-item>
          </a-form>
        </div>
        <rx-grid
                ref="table"
                :allowRowSelect="true"
                :multiSelect="true"
                :columns="columns"
                :defaultPageSize="10"
                :url="'/api-bpm/bpm/core/bpmAuth/queryByUser?userId='+$route.params.userId"
                :queryParam="queryParam"
                data-field="result.data"
                :pageSizeOptions="['10','30','40']"
                id-field="id"
                @selectChange="onSelectChange"
                @getListData="getListData"
                :handRowClass="handRowClass"
        >
            <span slot="status" slot-scope="{ text, record }">
                <a-tag :color="statusMap[text].color">
                    <span>{{statusMap[text].text}}</span>
                </a-tag>
            </span>
            <span slot="action" slot-scope="{ text, record }" class="actionIcons" size="3">
                <span v-if="record.status=='YES'" @click="setActiveTime(record.id)">{{i18n('list.setValidTime','设置有效期')}}</span>
                <span v-if="record.status=='YES'" @click="delAuth([record.id])">{{$ti18('rxList.delBtn','删除')}}</span>
          </span>
        </rx-grid>
      </rx-fit>
    </div>
  </rx-layout>
</template>

<script>
  import BpmAuthApi from '@/api/bpm/core/bpmAuth'
  import {BaseList, RxFit, Dialog, RxUserInfo, Util} from '@lowcode/jpaas-common-lib';
  import BpmAuthSetActiveTime from "./BpmAuthSetActiveTime";
  import BpmDefDialog from "@/views/modules/bpm/ws/BpmDefDialog.vue";

  export default {
      name: 'BpmAuthList',
      mixins: [BaseList],
      components: {
          RxFit,
          RxUserInfo
      },
      data() {
          return {
              columns: [
                  {
                      title: this.$ti18('rxList.index','序号'),
                      type: 'indexColumn',
                      width: 30,
                      dataIndex: 'serial',
                      scopedSlots: {customRender: 'serial'}
                  },
                  {title: this.i18n('form.processNum','流程编号'), dataIndex: 'processKey', width: 100},
                  {title: this.i18n('form.processName','流程名称'), dataIndex: 'processName', width: 100},
                  {title: this.i18n('form.validTime','有效期'), dataIndex: 'activeTime', width: 50},
                  {title: this.i18n('form.authUserName','授权用户人'), dataIndex: 'authUserName', width: 50},
                  {title: this.i18n('form.authTime','授权时间'), dataIndex: 'createTime', width:80},
                  {title: this.i18n('form.status','状态'), dataIndex: 'status', width: 50, scopedSlots: {customRender: 'status'}},
                  {title: this.i18n('form.invalidTime','失效时间'), dataIndex: 'delTime', width: 80},
                  {title: this.$ti18('rxList.action','操作'), width: 100, dataIndex: 'action', scopedSlots: {customRender: 'action'}}
              ],
              comment: this.i18n('list.processForm','流程授权表'),
              widthHeight: ['800px', '600px'],
              fitSearch: false,
              statusMap: {
                  "YES": {color: 'green', text: this.i18n('valid','有效')},
                  "NO": {color: 'red', text: this.i18n('invalid','无效')},

              },

          }
      },
      methods: {
          i18n(name, text, key) {
              return this.$ti18(name, text, "bpmUserAccess", key);
          },
          i18n2(name, text, key) {
              return this.$ti18(name, text, "BpmAgent", key);
          },
          delById(ids) {
              return BpmAuthApi.delAuth({ids: ids.join(',')});
          },
          getListByParams(parameter) {
              return BpmAuthApi.query(parameter)
          },
          back() {
              window.history.go(-1);
          },
          delAuth(ids){
              let self_ = this;
              this.$confirm({
                  title: this.$ti18('rxMsa.actionTips','操作提示'),
                  zIndex: 20000,
                  content: this.i18n('deleteInfo','该操作将会删除该流程和按钮授权，是否确定执行该操作？'),
                  okText: this.$ti18('rxForm.ackBtn','确认'),
                  cancelText: this.$ti18('rxForm.cancelBtn','取消'),
                  onOk() {
                      self_.delById(ids).then(res => {
                          if (res.success && res.code == 200) {
                              self_.refreshGrid()
                          }
                          self_.selectedRowKeys = [];
                          self_.selectedRows = [];
                      })
                  },
                  onCancel() {
                  }
              })
          },
          addProcess(){
              var self_=this;
              Util.open({
                  component:BpmDefDialog,
                  curVm:self_,
                  max:true,
                  title:self_.i18n2('processList.title','流程定义'),
                  data:{}
              },function (action,data){
                  if (action!="ok"){
                      return;
                  }
                  if(data && data.length>0){
                      BpmAuthApi.saveAddProcessArray(self_.$route.params.userId,data.map(item=>{return item.defId}).join(',')).then(res=>{
                          self_.refreshGrid();
                          self_.selectedRowKeys = [];
                          self_.selectedRows = [];
                      })
                  }
              });
          },
          setActiveTime(pkId){
              var self=this;
              var baseConf = {
                  "curVm": this,
                  component: BpmAuthSetActiveTime,
                  title: this.i18n('list.resetValidTime','重设有效期'),
                  widthHeight: ['600px', '200px'],
                  data: {
                      pkId:pkId
                  }
              };
              Util.open(baseConf, function (action) {
                  if(action!='ok')return;
                  self.refreshGrid();
                  self.selectedRowKeys = [];
                  self.selectedRows = [];
              })
          },
          getListData(data){
              //刷新组件
              this.$forceUpdate();
          },
          handRowClass(record,index){
              if(record.activeTime!='longTime' && new moment()>new moment(record.activeTime)){
                  return 'simpleGrayRow';
              }
              if(record.status=='NO'){
                  return 'grayRow';
              }
              return '';
          }
      }
  }
</script>
<style scoped>

</style>

